
<!-- 左侧导航栏
props:isControl控制导航栏关闭
-->
<template>
 <el-scrollbar >
                  <el-menu active-text-color="#ffd04b" background-color="#545c64" class="el-menu-vertical-demo"
                     :collapse="isControl" :default-active="$route.path" text-color="#fff" router>
                     <!-- 首页 -->
                     <el-menu-item :index="'/index/' + ite.path" v-for="ite in menus.slice(0, 1)" :key="ite.name">
                        <el-icon :class="ite.meta.icon"></el-icon>
                        <span>{{ $t(ite.meta.title) }}</span>
                     </el-menu-item>
                     <!-- 导航外层 -->
                     <el-sub-menu :index="'/index/' + item.path" v-for="item in menus.slice(1)" :key="item.name">
                        <template #title>
                           <el-icon :class="item.meta.icon"></el-icon>
                           <span>{{ $t(item.meta.title) }}</span>
                        </template>
                        <!-- 导航内层 -->
                        <template v-for="ites in item.children" :key="ites.name">
                           <el-menu-item :index="'/index/' + item.path + '/' + ites.path" v-if="!ites.meta.hidden">
                           <span>{{ $t(ites.meta.title) }}</span>
                        </el-menu-item>
                        </template>
                     </el-sub-menu>
                  </el-menu>
               </el-scrollbar>
</template>
<script setup lang="ts">
import menus from '@/router/pages'
const props=defineProps({//接收父传子过来的Boolean值
   isControl:{type:Boolean,default: false}//效验选项，
})



</script>
<style lang="less" scoped>
.el-menu {
   height: 100vh;

   &:not(.el-menu--collapse) {
      width: 200px;
   }

}
</style>